Visual Studio CodeでPrettierのフォーマット機能を言語単位で無効にする

こんにちは、CX事業本部の若槻です。

今回は、Visual Studio Codeに導入したPrettierプラグインのフォーマット機能を言語単位で無効にしてみました。

Prettierとは？

コードフォーマッターです。2020年9月時点で、8種類以上のエディター、24種類以上の言語に対応しています。

• https://prettier.io/

なぜPrettierのフォーマット機能を言語単位で無効にしたかったのか？

わたしはVisual Studio CodeにPrettierエクステンションを導入して使用しています。開発時のコードフォーマット機能としてはとても便利なのですが、ひとつ困っていたのがマークダウン文書の作成時に意図しないフォーマットがPrettierにより行われてしまうことでした。

その中でも一番困っていたのが、下記のようにマークダウン文書（名前がXXXX.MDのファイル）を編集していると、

ファイル保存時にPrettierの機能で日本語と英語の間に半角スペースが自動挿入されてしまうことです。

人によるかと思いますが、私の場合はおせっかい機能でしかなかったので、マークダウン言語の時のみPrettierのフォーマット機能を無効にしたいです。

Prettierのフォーマット機能を言語単位で無効にする

VS Codeでマークダウンの時だけPrettierのフォーマット機能を無効にしてみます。

VS Codeのエクステンション一覧でPrettierの[Extention Settings]を開きます。

[Prettier: Disable Languages]という項目があるので、[Add Item]をクリックします。

入力欄に無効化したい言語名（今回はmarkdown）を入力して[OK]をクリックします。

Disable Languagesの一覧にmarkdownが追加されました。

これでマークダウン言語に対するフォーマット機能が無効化されたので、マークダウン文書を編集して保存しても英語と日本語の間に自動で半角スペースが挿入されなくなりました。

おわりに

Visual Studio Codeに導入したPrettierプラグインのフォーマット機能を言語単位で無効にしてみました。

現在VS CodeでDeveloper.IOのブログを書いてみるなんてことに挑戦しているので、執筆環境を少しずつ快適にしていきたいです。

参考

• 巷で噂のコードフォーマッター、「Prettier」を使ってみたよ | Front Note
• VSCodeでMarkdownの自動フォーマット＆整形ルールを自由に設定 | Qiita
• PrettierでMarkdownをフォーマットしたときの英語と日本語の間に入るスペースをどうにかする | Qiita

以上